<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../plugin/layui-v2.2.5/layui/css/layui.css">
  <!-- 教师应交材料页面 -->
</head>
<body style="overflow-y: scroll;">
  <div class="layui-row">
  	<div class="layui-col-md6">
	    <button id="addAcademe" data-method="addAcademe" class="layui-btn" style="float: left;margin-left: 10px">新建</button>
	    <button type="button" class="layui-btn" id="uploadFile">
	      <i class="layui-icon">&#xe67c;</i>上传文件
	    </button>
  	</div>
    <div class="layui-col-md6">
		<button id="academeSearch_btn" data-method="search" class="layui-btn" style="float: right;margin-left: 10px">搜索</button>    
	    <input name="academe_search" id="academe_search" class="layui-input" type="text" style="float: right;width: 200px" >
    </div>
  </div>
  <div class="layui-row">
    <table class="layui-hide" id="academeGrid" lay-filter="academeGrid"></table>  
  </div>
  <script type="text/html" id="academeBar">
    <a class="layui-btn layui-btn-xs" lay-event="save">保存</a>
	<a class="layui-btn layui-btn-xs" lay-event="showDepartment">查看系</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
  </script>    
          
<script src="../plugin/layui-v2.2.5/layui/layui.js"></script>
<script src="../plugin/jquery-3.1.1.min.js"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
//全局变量
var academe = "";

layui.use(['table','layer','upload'], function(){
  var table = layui.table;

  
  table.render({
	    elem: '#academeGrid'
	    ,url: '/CMA/academe/getAcademeGrid'
	    ,method: 'post' 
	    ,done: function(res, curr, count){
	        //如果是异步请求数据方式，res即为你接口返回的信息。
	        //如果是直接赋值的方式，res即为：{data: [], count: 99} data为当前页数据、count为数据总长度
	        console.log(res);
	      }
	    ,cols: [[ //标题栏
	      {field: 'academename', title: '学院名称',edit: 'text'}
	      ,{field: 'academecode', title: '学院代码', sort: true,edit: 'text'}
	      ,{fixed: 'right', align:'center', toolbar: '#academeBar'}
	    ]]
	    //,data: tableData
	    ,skin: 'line' //表格风格
	    ,even: true
	    ,page: true //是否显示分页
	    ,limits: [5, 7, 10]
	    ,limit: 5 //每页默认显示的数量 
	    ,id : "academeGrid"
	 })
  
  var active = {
    search : function(){
    	var searchKey = $("#academe_search").val();
    	//console.log(searchKey);
    	table.reload('academeGrid', {
    		  where: { //设定异步数据接口的额外参数，任意设
    		    key: searchKey
    		    //…
    		  }
    		  ,page: {
    		    curr: 1 //重新从第 1 页开始
    		  }
    	});
    }
  	,addAcademe : function(){
  		//利用重载表格增加一行
  		table.reload('academeGrid', {
  		  where: { //设定异步数据接口的额外参数，任意设
  		    key: "add"
  		  }
  		  ,page: {
  		    curr: 1 //重新从第 1 页开始
  		  }
  		});
  	}
    ,getCheckData: function(){ //获取选中数据
        var checkStatus = table.checkStatus('idTest')
        ,data = checkStatus.data;
        layer.alert(JSON.stringify(data));
     }
     ,getCheckLength: function(){ //获取选中数目
        var checkStatus = table.checkStatus('idTest')
        ,data = checkStatus.data;
        layer.msg('选中了：'+ data.length + ' 个');
     }
     ,isAll: function(){ //验证是否全选
        var checkStatus = table.checkStatus('idTest');
        layer.msg(checkStatus.isAll ? '全选': '未全选')
     }
  };

  $('.layui-btn').on('click', function(){
    var othis = $(this), method = othis.data('method');
    active[method] ? active[method].call(this, othis) : '';
  });

  //监听工具条
  table.on('tool(academeGrid)', function(obj){
    var data = obj.data;
    //表格保存操作
    if(obj.event === 'save'){
    	$.ajax({ 
        	url: "/CMA/academe/addAcademe",
        	contentType: "application/x-www-form-urlencoded",
        	type:"post",
        	dataType : "json",
        	data : data,
        	success: function(data){
        		layer.msg(data.msg, {
        		   time: 2000, //20s后自动关闭
        		});
        		//添加成功重载表格
        		table.reload('academeGrid', {
        	  		  where: { //设定异步数据接口的额外参数，任意设
        	  			  key:null
        	  		  }
        	  		  ,page: {
        	  		    curr: 1 //重新从第 1 页开始
        	  		  }
        	  	});
        	}
          });
    } else if(obj.event === 'del'){
      layer.confirm('真的删除行么', function(index){
        obj.del();
        $.ajax({ 
        	url: "/CMA/academe/delAcademe",
        	contentType: "application/x-www-form-urlencoded",
        	type:"post",
        	dataType : "json",
        	data : data,
        	success: function(data){
        		layer.msg(data.msg, {
    		        time: 2000, //20s后自动关闭
    		      });
        	}
          });
        layer.close(index);
      });
    } else if(obj.event === 'showDepartment'){
    	//设置id，方便子窗口获取
    	setId(data.id);
    	layer.open({
            type: 2 //此处以iframe举例
            ,title: '院系维护'
            ,area: [' 500px','450px']
            ,shade: 0
            ,maxmin: true
            ,offset: 'auto'
            ,content: 'department.html'
            ,zIndex: layer.zIndex //重点1
            ,success: function(layero){
              layer.setTop(layero); //重点2
            }
          });
    }
  });
  

  
  
  //文件上传
  var upload = layui.upload;
  var uploadInst = upload.render({
    elem: '#uploadFile' //绑定元素
    ,url: '/upload/' //上传接口
    ,accept: 'file' //普通文件
    ,done: function(res){
      //上传完毕回调
    }
    ,error: function(){
      //请求异常回调
    }
  });

});

function setId(academeId){
	  academe = academeId;
}

function getId(){
	  return academe;
}

</script>

</body>
</html>